<link rel="stylesheet" href="../css/playList.css">
<div class="playList">
    <div class="p-wrap">
        <div class="p-title clean">
            <h3>
                <span onclick="getList('')">全部</span>
                <a onclick="$('.cateListBox').toggleClass('hide')" href="javascript:;">
                    <i>
                        选择分类
                        <em></em>
                    </i>
                </a>
            </h3>
            <div class="p-hot fr">
                <a href="javascript:;">热门</a>
            </div>
        </div>
        <div class="cateListBox hide">
            <div class="p-hd">
                <i></i>
            </div>
            <div class="p-bd">
                <h3>
                    <a onclick="getList('')" href="javascript:;">全部风格</a>
                </h3>
                <dl class="p-class clean">
                    <dt>
                        <i class="u-icn-71"></i>语种
                    </dt>
                    <dd>
                        <a onclick="getList('华语')" href="javascript:;">华语</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('欧美')" href="javascript:;">欧美</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('日语')" href="javascript:;">日语</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('韩语')" href="javascript:;">韩语</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('粤语')" href="javascript:;">粤语</a>
                        <span class="p-line">|</span>
                    </dd>
                </dl>
                <dl class="p-class clean">
                    <dt>
                        <i class="u-icn-6"></i>风格
                    </dt>
                    <dd>
                        <a onclick="getList('流行')" href="javascript:;">流行</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('摇滚')" href="javascript:;">摇滚</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('民谣')" href="javascript:;">民谣</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('电子')" href="javascript:;">电子</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('舞曲')" href="javascript:;">舞曲</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('说唱')" href="javascript:;">说唱</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('轻音乐')" href="javascript:;">轻音乐</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('爵士')" href="javascript:;">爵士</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('乡村')" href="javascript:;">乡村</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('R&B/Soul')" href="javascript:;">R&B/Soul</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('古典')" href="javascript:;">古典</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('民族')" href="javascript:;">民族</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('英伦')" href="javascript:;">英伦</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('金属')" href="javascript:;">金属</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('蓝调')" href="javascript:;">蓝调</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('雷鬼')" href="javascript:;">雷鬼</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('世界音乐')" href="javascript:;">世界音乐</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('拉丁')" href="javascript:;">拉丁</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('New Age')" href="javascript:;">New Age</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('古风')" href="javascript:;">古风</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('Bossa Nova')" href="javascript:;">Bossa Nova</a>
                        <span class="p-line">|</span>
                    </dd>
                </dl>
                <dl class="p-class clean">
                    <dt>
                        <i class="u-icn-7"></i>场景
                    </dt>
                    <dd>
                        <a onclick="getList('清晨')" href="javascript:;">清晨</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('夜晚')" href="javascript:;">夜晚</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('夜晚')" href="javascript:;">学习</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('工作')" href="javascript:;">工作</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('午休')" href="javascript:;">午休</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('下午茶')" href="javascript:;">下午茶</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('地铁')" href="javascript:;">地铁</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('驾车')" href="javascript:;">驾车</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('运动')" href="javascript:;">运动</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('旅行')" href="javascript:;">旅行</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('散步')" href="javascript:;">散步</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('酒吧')" href="javascript:;">酒吧</a>
                    </dd>
                </dl>
                <dl class="p-class clean">
                    <dt>
                        <i class="u-icn-6"></i>情感
                    </dt>
                    <dd>
                        <a onclick="getList('怀旧')" href="javascript:;">怀旧</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('清新')" href="javascript:;">清新</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('浪漫')" href="javascript:;">浪漫</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('伤感')" href="javascript:;">伤感</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('治愈')" href="javascript:;">治愈</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('放松')" href="javascript:;">放松</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('孤独')" href="javascript:;">孤独</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('感动')" href="javascript:;">感动</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('兴奋')" href="javascript:;">兴奋</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('快乐')" href="javascript:;">快乐</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('安静')" href="javascript:;">安静</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('思念')" href="javascript:;">思念</a>
                        <span class="p-line">|</span>
                    </dd>
                </dl>
                <dl class="p-class clean">
                    <dt>
                        <i class="u-icn-9"></i>主题
                    </dt>
                    <dd id="p-last">
                        <a onclick="getList('综艺')" href="javascript:;">综艺</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('影视原声')" href="javascript:;">影视原声</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('ACG')" href="javascript:;">ACG</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('儿童')" href="javascript:;">儿童</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('校园')" href="javascript:;">校园</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('游戏')" href="javascript:;">游戏</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('70后')" href="javascript:;">70后</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('80后')" href="javascript:;">80后</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('90后')" href="javascript:;">90后</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('网络歌曲')" href="javascript:;">网络歌曲</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('KTV')" href="javascript:;">KTV</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('经典')" href="javascript:;">经典</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('翻唱')" href="javascript:;">翻唱</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('吉他')" href="javascript:;">吉他</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('钢琴')" href="javascript:;">钢琴</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('器乐')" href="javascript:;">器乐</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('榜单')" href="javascript:;">榜单</a>
                        <span class="p-line">|</span>
                        <a onclick="getList('00后')" href="javascript:;">00后</a>
                        <span class="p-line">|</span>
                    </dd>
                </dl>
            </div>
            <div class="p-bt"></div>
        </div>
        <ul class="p-content clean">
            
        </ul>
    </div>
</div>
<script src="../js/playList.js"></script>